<template>
	<view class="content">
		<u-popup :round="10" :show="dispatchShow" mode="center">
			<view class="dispatchBox stowageBox">
				<view class="close" @click="dispatchClose()">
					<u-icon name="close" labelSize= "14"></u-icon>
				</view>
				<view class="dispatchHead">
					选择调度
				</view>
				<view class="tabUl">
					<view class="tabLi" v-for="(item, index) in radiolist1" :key="index"> 
						{{ item.name }}  
						<view class="selBox" :class="item.disabled?'seled':''" @click="radioChange1(item,index)">
							<u-icon v-if="item.disabled" name="checkbox-mark" color="#FFFFFF" size="18"></u-icon>
						</view>
					</view>
				</view>
				<view class="selDispatch"  @click="selStowageStatu()">
					<view>确定</view>
				</view>
			</view>
		</u-popup>
		<view class="header-wrap">
			<view class="nav-wrap">
				<view class="left" style="float: left;font-size: 40rpx; width:30rpx; height:40rpx" @click="back()">
					<image src="../../static/back.png" mode=""></image>
				</view>
				<view class="types">
					{{ waybillName }}
					<!-- 配载 -->
				</view>
				<!-- <text @click="changeHand()" v-if="isChange == 0">切换模式</text> -->
				<text></text>
			</view>
			
		</view>
		<view class="head">
			<view class="headCon">
				<view class="headConTop">
					<u-icon class="icon" name="car"></u-icon>
					<text>运输总量</text>
				</view>
				<view class="num">
					{{ info.loadingOrderPlanShippingNum }}
				</view>
			</view>
			<view class="headCon">
				<view class="headConTop">
					<u-icon class="icon" name="car-fill"></u-icon>
					<text>可配载总量</text>
				</view>
				<view class="num">
					{{ info.sureLoadingOrderNum }}
				</view>
			</view>
			<view class="headCon">
				<view class="headConTop">
					<u-icon name="calendar-fill"></u-icon>
					<text>运输单价</text>
				</view>
				<view class="num" v-if=" waybillModesel == 3 && goodsState !=1" style="color: #4e87f1;" @click="showPrice">
					¥{{info.shippingPrice}}
					
				</view>
				<view class="num" v-else>
					¥{{info.shippingPrice}}
				</view>
			</view>
		</view>
		<view class="selList" v-if=" waybillModesel == 1">
			<view class="selLi"  @click="openDriver">
				司机 
				<view class="fr">
					{{driver.driverName?driver.driverName + '|' +driver.mobile:'请选择'}}
					<u-icon v-if="!driver.driverName" name="arrow-right" size="13" color="#9E9E9E"></u-icon>
				</view>
			</view>
			<u-popup :round="10" :show="driverShow" @close="close">
				<view class="driverPopup">
					<view class="head">
						<text @click="driverShow=false">取消</text>
						请选择承运司机
						<text class="addDriver" @click="addDriver">新增</text>
					</view>
					<u-search shape="square" placeholder="请输入司机姓名/手机号码"  :showAction="false" v-model="driverInput" @change="searchDriver()"></u-search>
					<view class="driverCont">
						<u-loading-icon text="加载中" v-if="loadingDriver" textSize="18"></u-loading-icon>
						<view class="notext" v-show="!driverData.length && !loadingDriver">暂无司机信息，请新增</view>
						<view class="driverList">
							<view class="driverLi" v-for="item in driverData" :key="item.phone" @click="selDriver(item)">
								<view class="driverName">
									{{item.driverName}}
								</view>
								<view class="driverPhone">
									{{item.mobile}}
								</view>
							</view>
						</view>
					</view>
				</view>
			</u-popup>
			<view class="selLi"   @click="openCar">
				车辆
				<view class="fr">
					{{ carInfo.plateNum?carInfo.plateNum:'请选择'}}<span class="icon"><u-icon name="arrow-right" size="13" color="#9E9E9E"></u-icon></span>
				</view>
			</view>
			<u-popup :round="10" :show="showCar" @close="showCar=false">
				<view class="driverPopup">
					<view class="head">
						<text @click="showCar=false">取消</text>
						请选择承运车辆
						<text class="addDriver" @click="addCar">新增</text>
					</view>
					<u-search shape="square" placeholder="请输入车牌号码" :showAction="false" v-model="carInput" @change="searchCar()"></u-search>
					<view class="driverCont">
						<view class="notext" v-show="false">暂无车辆信息，请新增</view>
						<view class="carList">
							<view class="carLi" v-for="item in carData" :key="item.phone"  @click="selCar(item)">
								<view class="driverName">
									{{item.plateNum}}
								</view>
							</view>
						</view>
					</view>
				</view>
			</u-popup>
			
		</view>
		<view class="selList" v-if=" waybillModesel == 1">
			<view class="selLi">
				运输数量 <text :style="Number(info.unit)>6?'font-size: 14rpx':''">({{info.unitName}}) </text>
				<view class="fr">
					<u--input v-if="reset"
					inputAlign = "right"
					style="width: 400rpx;"
					    :placeholder="'计划运输量不能超过'+info.sureLoadingOrderNum+ info.unitName"
					    border="surround"
						type="number"
					    v-model="addForm.planShippingNum"
						@input="inputAlanNum"
					  ></u--input>
				</view>
			</view>
			<view class="selLi">
				到付金额(元)
				<view class="fr">
					<u--input 					
					inputAlign = "right"
					    placeholder="请输入到付金额"
					    border="surround"
						type="number"
					    v-model="addForm.prepayTotal"
						@change="changecollect"
					  ></u--input>
					
				</view>
			</view>
			<view class="selLi">
				回单付金额(元)
				<view class="fr">
					<u--input					
					inputAlign = "right"
					    placeholder="请输入回单付金额"
					    border="surround"
						type="number"
					    v-model="addForm.receiptTotal"
					></u--input>
					
				</view>
			</view>
		</view>
		<view class="remarks" v-if=" waybillModesel == 1">
			<h5>备注</h5>
			<view class="textBox">
				<u--textarea v-model="addForm.remark" confirmType="done" border="surround" placeholder="请输入备注内容(可不填)" ></u--textarea>
			</view>
		</view>
		
		<view class="selList" v-if="waybillModesel == 2">
			<view class="selLi"  @click="openDriver">
				可扫次数 
				<view class="fr">
					<u--input
					    placeholder="请填写次数"
					    border="surround"
						inputAlign= "right"
						type="number"
					    v-model="qrCodeTime"
						placeholderStyle="padding: 6px 0px 6px 9px"
					  ></u--input>
				</view>
			</view>
			<view class="selLi"  @click=" showDate = true">
				 二维码有效期
				<view class="fr" style="padding-right: 18rpx;">
					{{date}}
					 <u-datetime-picker
							:show="showDate"
							v-model="value1"
							mode="datetime"
							:minDate="minDate"
							@confirm="selDate"
							@cancel="showDate = false"
					></u-datetime-picker>
				</view>
			</view>
			<view class="selLi"  @click=" showWay = true">
				 运费结算方式
				<view class="fr">
					<u--input style="text-align: right;" v-model="nameWay" placeholder="选择运费结算方式" fontSize="30rpx" suffixIcon="arrow-right"
						suffixIconStyle="color: #c0c4cc" disabled disabledColor="#fff">
					</u--input>
				</view>
			</view>
			<!-- <u-form-item label="运费结算方式" prop="name" required borderBottom @click="showWay = true">
				
			</u-form-item> -->
		</view>
		<view class="modeThree" v-if="waybillModesel == 3">
			<!-- <view class="tabBox">
				<tabbar :tabItem="tabItem" :tabIndex="tabIndex" @tabClick="tabClick" textColor="#999"></tabbar>
			</view> -->
			<view class="tabBox1">
				<view class="tabLeft">
					<view class="tabLi" :class="tabIndex == 0 ?'tab_select':''" @click="noClick0?'':tabClick(0)" >
						<view :style="noClick0?'background:#FAFAFA':''">手机抢单
						</view>
					</view>
					<view class="tabLi" :class="tabIndex == 1  ?'tab_select':''" @click="noClick1?'':tabClick(1)">
						<view :style="noClick1?'background:#FAFAFA':''">
							定额抢单
						</view>
					</view>
				</view>
			</view>
			<view v-if="tabIndex == 0">
				<view class="mode3Li" @click="noSeled0?'':showStarDate = true">
					开始时间
					<view class="fr">
						{{freightForm.starDate}}
						 <u-datetime-picker
								:show="showStarDate"
								v-model="value2"
								mode="datetime"
								:minDate="minDate"
								:formatter="formatter"
								@confirm="selDate1"
								@cancel="showStarDate = false"
						></u-datetime-picker>
					</view>
				</view>
				<view class="mode3Li"  @click="noSeled0?'':showEndDate = true">
					结束时间
					<view class="fr">
						{{freightForm.endDate}}
						 <u-datetime-picker
								:show="showEndDate"
								v-model="value2"
								mode="datetime"
								:minDate="minDate1"
								@confirm="selDate2"
								@cancel="showEndDate = false"
						></u-datetime-picker>
					</view>
				</view>
				<view class="mode3Li"  @click="noSeled0?'':showfreight = true">
					运费取整
					<view class="fr" >
						{{ freightVal }}
						
						<u-popup :show="showfreight" mode="bottom" :closeOnClickOverlay="true" round="10">
							<view class="popup-wrap">
								<view class="head">
									运费取证
								</view>
								<view class="popup-list">
									<view class="box third">
										<text class="type-item" v-for="(item, index) in natureColumns" :key="index" @click="freightChange(item)"
											:class="{'active':freightForm.freightValue == item.dicValue}">{{item.dicName}}</text>
									</view>
								</view>
								<view class="popup-btn">
									<view class="cancel btn" @click="typeCancel">取消</view>
									<view class="confirm btn" @click="typeConfirm">确认</view>
								</view>
							</view>
						</u-popup>
					</view>
				</view>
				<view class="mode3Li" >
					显示运输单价
					<view class="fr">
						<u-switch style="margin-top: 24rpx;" size="20" :disabled="noSeled0" v-model="checked"></u-switch>
					</view>
				</view>
				<view class="remarks">
					<h5>备注</h5>
					<view class="textBox">
						<u--textarea style="height: 296rpx;" :disabled="noSeled0"  v-model="freightForm.remark" confirmType="done" border="surround" height="100%" placeholder="请输入备注内容(可不填)" ></u--textarea>
					</view>
				</view>
			</view>
			<view v-if="tabIndex == 1">
				<view class="mode3Li" @click="noSeled1?'':showStarDate = true">
					开始时间
					<view class="fr">
						{{freightForm.starDate}}
						 <u-datetime-picker
								:show="showStarDate"
								v-model="value2"
								mode="datetime"
								:formatter="formatter"
								:minDate="minDate"
								@confirm="selDate1"
								@cancel="showStarDate = false"
						></u-datetime-picker>
					</view>
				</view>
				<view class="mode3Li"  @click="noSeled1?'':showEndDate = true">
					结束时间
					<view class="fr">
						{{freightForm.endDate}}
						 <u-datetime-picker
								:show="showEndDate"
								v-model="value2"
								:minDate="minDate1"
								mode="datetime"
								@confirm="selDate2"
								@cancel="showEndDate = false"
						></u-datetime-picker>
					</view>
				</view>
				<view class="mode3Li">
					每车载重
					<text :style="Number(info.unit)>6?'font-size: 24rpx':''">({{info.unitName}}) </text>
					<view class="fr">
						<u--input
						inputAlign = "right"
						    placeholder="请输入每车载重"
						    border="surround"
							type="number"
							:disabled="noSeled1"
						    v-model="freightForm.goodsLoad"
							@input = "inputAlanNum1"
						  ></u--input>
					</view>
				</view>
				<view class="mode3Li">
					到付金额（元）
					<view class="fr">
						<u--input v-if="reset"
						inputAlign = "right"
						    placeholder="请输入到付金额"
						    border="surround"
							type="number"
							style="background: #FFF;"
							:disabled="noSeled1"
						    v-model="freightForm.collectPayment"
							@input="changecollect1"
						  ></u--input>
					</view>
				</view>
				<view class="mode3Li">
					回单付金额（元）
					<view class="fr">
						<u--input
						inputAlign = "right"
						    placeholder="请输入回单付金额"
						    border="surround"
							type="number"
							:disabled="noSeled1"
							style="background: #FFF;"
						    v-model="freightForm.receiptPayment"
						  ></u--input>
					</view>
				</view>
				<view class="mode3Li" >
					显示运输单价
					<view class="fr">
						<u-switch style="margin-top: 24rpx;" :disabled="noSeled1" size="20"  v-model="checked"></u-switch>
					</view>
				</view>
				<view class="remarks">
						<h5>备注</h5>
						<view class="textBox">
							<u--textarea style="height: 296rpx;" :disabled = "noSeled1" v-model="freightForm.remark" confirmType="done" border="surround"   placeholder="请输入备注内容(可不填)" ></u--textarea>
						</view>
					</view>
				
			</view>
			
		</view>
		<u-popup :show="addSel" mode="center" :closeOnClickOverlay="false" round="10">
			<view class="addDiv">
				<view class="words">配载成功!</view>
				<view class="selbtn">
					<view style="border-right: 2rpx solid #333;" @click="seeStoDetail">
						查看配载单
					</view>
					<view  @click="addNew">
						继续配载
	
					</view>
				</view>
					
				
			</view>
		</u-popup>
		<!-- 运费结算方式 -->
		<u-popup :show="showWay" @close="cancelWay" :round="10">
			<view class="popup-wrap">
				<view class="title">运费结算方式</view>
				<view class="popup-empty" v-if="!listWay">暂无数据～～～</view>
				<view class="popup-list">
					<u-radio-group v-model="valueWayCache" placement="column" iconPlacement="right"
						activeColor="#00468C" @change="changeWay">
						<view class="item" v-for="(item, index) in listWay" :key="index">
							<u-radio :label="item.name" :name="item.value"></u-radio>
						</view>
					</u-radio-group>
				</view>
				<view class="popup-btn">
					<view class="cancel btn" @click="cancelWay">取消</view>
					<view class="confirm btn" @click="confirmWay">确认</view>
				</view>
			</view>
		</u-popup>
		
		<view class="btnBox" @click="save"  v-if="waybillModesel != 3">
			<view class="btn">
				确定
			</view>
		</view>
		<view class="btnBox" v-if="waybillModesel == 3 "> <!-- && tabIndex == 0 -->
			<view class="save btn" @click="saveFreight()">保存</view>
			<view class="up btn" @click="upFreight(1)">直接发布</view>
		</view>
		
		<view class="btnBox" v-if="waybillModesel == 3 && goodsState ==1">
			<view class="btn" @click="down(1)">
				下架
			</view>
		</view>
		<!-- <view class="btnBox" v-if="waybillModesel == 3 && tabIndex == 1">
			<view v-if="!noSeled1" class="btn" @click="upFreight(2)">确定</view>
			<view v-else class="btn"  @click="down(2)">
				修改
			</view>
		</view> -->
		<!-- 修改价钱 -->
		<u-popup :show="changeShippingPrice"  mode="center" :round="10">
			<view class="popup-wrap" style="width:600rpx">
				<view class="title">请输入需要修改的运价</view>
				<view class="popup-list" style="display: flex;">
					<view style="border: 2rpx solid #dadada;margin-left: 60rpx;">
						<u--input
						    placeholder="请输入运价"
							type="number"
						    border="surround"
						    v-model="shippingPrice"
							@input = "resetShippingPrice"
						  ></u--input>
					</view>
					<view style="line-height: 66rpx;margin-left: 10rpx;">
						 元/{{info.unitName}}
					</view>
				</view>
				<view class="popup-btn">
					<view class="cancel btn" @click="cancelShippingPrice">取消</view>
					<view class="confirm btn" @click="changePrice">确认</view>
				</view>
			</view>
		</u-popup>
		
	</view>
</template>

<script>
	import {
		querySelectorDriver,querySelectorVehicle,wayBillStowageInfo,updateWayBillMold,configureQrCode,shipWaybill,freightSel,getGoodsSquare,updateShippingPrice
	} from '@/config/api/app.js'
	import Cache from '@/utils/cache'
	import tabbar from '@/components/tabBox/tab.vue'
	export default {
		components: {
			tabbar,
		},
		data() {
			return {
				etpId:'',//企业id
				driverShow: false, //司机弹框
				driver:{},//选定的司机
				dispatchShow: false,
				showCar: false, //车辆弹框
				checked: true,
				checked1: false,
				addForm:{
					prepayTotal: '', //预付预付
					receiptTotal: '',//回单付
					driverName: '', //司机名称
					driverId:'', //司机id
					driverTel:'', //手机
					planShippingNum:'', //计划运输数量
					vehicleNo:'', //车牌
					vehicleId:'', //车辆id
					vehicleTypeId:'', //可选
					remark:'',//备注
				},//指派模式新增配载单
				driverData:[],//司机列表
				loadingDriver: false,
				carInput:'',
				driverInput: '',
				carData: [],//车辆列表
				carInfo:{},
				info:{},
				waybillName: '', //配载模式名称
				waybillMode: 0, // 是否配载模式
				radiolist1: [{name: '指派模式',disabled: false},{name: '抢单模式',disabled: false},{name: '货源广场',disabled: false}],
				waybillModesel: 0,
				selname: '指派模式',
				showDate: false,
				date:'请选择时间',
				value1: Number(new Date()),
				qrCodeTime: '',//可扫次数
				addSel: false,
				tabItem: ['手机抢单', '定额抢单'],
				tabIndex: 0,
				showStarDate: false,//开始时间
				showEndDate: false,
				value2: Number(new Date()),
				// starDate:'请选择 >',
				natureColumns: [],
				freightVal: '请选择 >',
				showfreight: false,
				freightForm: {
					starDate:'请选择 >',
					endDate: '请选择 >',
					freightValue: 1,
					remark:'',
					"goodsLoad":'',//每车载重
					"collectPayment": '',//到付
					"receiptPayment":'',// 回单付
				},
				checked: true,
				noSeled0: false,
				noSeled1: false,
				noClick0: false,
				noClick1: false,
				reset: true,
				minDate: Number(new Date()),//二维码有效期
				minDate1: Number(new Date()),
				isChange: 0,//为空时候为false，显示切换
				itemId:'',
				showWay:false,//实装实卸选择
				valueWayCache:'',
				listWay: [{name: '实卸模式', value: '1'},{name: '实装模式', value: '2'},{name: '实装实卸取最小值', value: '3'}],
				nameWay:'',//实装实卸绑定数据
				changeShippingPrice: false,
				shippingPrice: '',//修改货源广场的价钱
				goodsState: null,//货物上架状态 0未上架 1上架 2下架
			}
		},
		created() {
			this.etpId = Cache.get('USERINFO')[0].etpId
			this.loadingDriver= true
			this.getDriver() //司机弹框
		},
		onLoad(option) {
			
			this.itemId = option.itemId
			this.isChange = option.isChange
			this.waybillName =  option.waybillName
			this.waybillModesel = option.waybillName == '指派模式'?1: option.waybillName == '抢单模式'?2:3
			this.radiolist1[ this.waybillModesel - 1].disabled = true
			this.wayBillId = option.wayBillId
			
			this.getInfo({wayBillId: option.wayBillId})
			this.getfreightSel()
			setTimeout(this.getGoodsSquareInfo({Waybill :option.wayBillId}),1500)
		},
		watch:{
			addForm:{
				planShippingNum(newVal, oldVal) {
				}
			}
		},
		methods:{
			showPrice(){
				this.changeShippingPrice = true
			},
			//关闭弹框
			cancelShippingPrice(){
				this.changeShippingPrice = false
				this.shippingPrice = ''
			},
			//暂时修改货源广场单价
			changePrice(){
				this.changeShippingPrice = false
				this.info.shippingPrice = this.shippingPrice
				this.shippingPrice = ''
				
			},
			//确认保存
			trueChange(){
				let data = {
					waybillId: this.wayBillId,
					shippingPrice: this.info.shippingPrice
				}
				updateShippingPrice(data).then(res => {
					if(res.code == 0){
						 this.getInfo({wayBillId: this.wayBillId})
					}
				})
			},
			//校验运价
			resetShippingPrice(){
				let str =this.shippingPrice.split(".")[1]?this.shippingPrice.split(".")[1]:''
			
				if(str.length >= 2){
					
					this.$nextTick(() => {
						this.shippingPrice = Number(this.shippingPrice).toFixed(2)
					})
				}
			},
			//实装实卸选择
			changeWay(e) {
				this.valueWayCache = e
			},
			cancelWay() {
				this.showWay = false
				this.valueWayCache = this.valueWay
			},
			confirmWay() {
				this.showWay = false
				this.valueWay = this.valueWayCache
				if (!this.valueWay) return
				let obj = this.listWay.find(item => {
					return item.value == this.valueWay
				})
				this.nameWay = obj.name
			},
			
			getGoodsSquareInfo(data){
				getGoodsSquare(data).then(res => {
					if(res.code == 0){
						if(!res.data.pricingMethod){
							return false
						}
						if(res.data.pricingMethod == 1){
							// this.noSeled0 = true
							this.noClick1 = true
							this.tabIndex = 0
							if(res.data.goodsState == 2){
								this.noSeled0 = false
							}else if(res.data.goodsState == 1){
								this.noSeled0 = true
							}else{
								this.noSeled0 = false
							}
							
						}else{
							// this.noSeled1 = true
							this.noClick0 = true
							this.tabIndex = 1
							if(res.data.goodsState == 2){
								this.noSeled1 = false
							}else if(res.data.goodsState == 1){
								this.noSeled1 = true
							}else{
								this.noSeled1 = false
							}
						}
						this.freightForm.starDate =res.data.goodsTimeStart.substr(0, 16)
						this.freightForm.endDate =	res.data.goodsTimeEnd.substr(0, 16)
						this.freightForm.freightValue = res.data.freightRounding
						this.freightForm.remark = res.data.goodsRemarks
						this.checked = res.data.unitPriceDisplay == '0'?false: true
						this.freightForm.goodsLoad = res.data.goodsLoad
						this.freightForm.collectPayment = res.data.collectPayment
						this.freightForm.receiptPayment = res.data.receiptPayment
						this.goodsState = res.data.goodsState
						// "waybillMode": 1.指派模式2.抢单模式3.货源广场
						// "goodsTimeStart": 货物有效开始时间
						// "goodsTimeEnd": 货物有效结束时间
						// "pricingMethod": 计价方式 1.单位计价 2.固定计价
						// "freightRounding": 运费取整 1.运费不取整 2.个位取整 3.十位取整 4.百位取整
						// "unitPriceDisplay": 单价显示 0.不显示 1显示
						// "goodsRemarks": 货物备注
						// "goodsState":货物上架状态 0未上架 1上架 2下架
						// "goodsLoad":每车载重
						// "collectPayment": 到付
						// "receiptPayment": 回单付
					}
				})
			},
			getfreightSel(){
				freightSel().then(res => {
					if(res.code == 0){
						this.natureColumns = res.data.FREIGHT_ROUNDING
						
						let a =  this.natureColumns.find(item =>{
							return item.dicValue == this.freightForm.freightValue
						})
						this.freightVal = a.dicName
					}else{
					   uni.$u.toast(res.msg);
					}
				})
			},
			//指派模式运输数量计算
			inputAlanNum(){
				if(Number(this.addForm.planShippingNum) > Number(this.info.sureLoadingOrderNum)){
					
					this.reset = false
					 uni.$u.toast('最大不能超过可配载总量');
					this.$nextTick(() => {
					   this.addForm.planShippingNum = ''
					   this.addForm.receiptTotal = ''
					 })
					
					this.reset = true
				}else{
					if(this.info.unitName.includes('集装箱')){
						const regex = /^[12]$/;
						if(!regex.test(this.addForm.planShippingNum)){
							uni.$u.toast('请输入正确的运输数量～')
							this.$nextTick(() => {
								this.addForm.planShippingNum = ''
								this.addForm.receiptTotal = ''
							})
							  return false
						}
					}
					// console.log(this.info.shippingPrice * this.addForm.planShippingNum,(this.info.shippingPrice * this.addForm.planShippingNum).toFixed(2))
					this.addForm.receiptTotal = (this.info.shippingPrice * this.addForm.planShippingNum).toFixed(2)
				}
				
			},
			//到付金额计算
			changecollect(){
				if(Number(this.addForm.prepayTotal) <= this.info.shippingPrice * this.addForm.planShippingNum){
					if(this.getnum(this.addForm.prepayTotal) > 2 ){
						this.$nextTick(() => {
							
							let val = this.addForm.prepayTotal
							let arr = val.split('.')
							let arr1 = arr[1].slice(0,2) 
							this.addForm.prepayTotal = arr[0]+'.'+arr1
							this.addForm.receiptTotal = (this.info.shippingPrice * this.addForm.planShippingNum - this.addForm.prepayTotal).toFixed(2);
						})
						
					}
					this.addForm.receiptTotal = (this.info.shippingPrice * this.addForm.planShippingNum - this.addForm.prepayTotal).toFixed(2);
					if(this.addForm.receiptTotal == 0){
						this.addForm.receiptTotal = ""
					}
				}else{
					this.reset = false
					this.$nextTick(() => {
						this.addForm.prepayTotal = (this.info.shippingPrice * this.addForm.planShippingNum).toFixed(2);
						this.addForm.receiptTotal = 0
					})
					this.reset = true
				}
				
			},
			getnum(num) {
				var s = num.toString();
				var result = s.split('.')
				let  result2 =result[1]? result[1].length: '0'
				return result2
			},
			
			//货源广场运输数量计算
			inputAlanNum1(){
				if(Number(this.addForm.planShippingNum) > Number(this.freightForm.goodsLoad)){
					this.reset = false
					 uni.$u.toast('最大不能超过可配载总量');
					this.$nextTick(() => {
					   this.freightForm.collectPayment = ''
					   this.freightForm.receiptPayment = ''
					 })
					 this.reset = true
				}else{
					console.log(this.info.unitName)
					if(this.info.unitName.includes('集装箱')){
						const regex = /^[12]$/;
						if(!regex.test(this.freightForm.goodsLoad)){
							uni.$u.toast('请输入正确的可配载总量～')
							this.$nextTick(() => {
								this.freightForm.goodsLoad = ''
								this.freightForm.receiptPayment = ''
							})
							  return false
						}
					}
					
					this.freightForm.receiptPayment = (this.info.shippingPrice * this.freightForm.goodsLoad).toFixed(2)
				}
				
			},
			//货源广场到付金额计算
			changecollect1(){
				if(Number(this.freightForm.collectPayment) <= (this.info.shippingPrice * this.freightForm.goodsLoad)){
			
					if(this.getnum( this.freightForm.collectPayment) > 2 ){
						this.$nextTick(() => {
							let val = this.freightForm.collectPayment
							let arr = val.split('.')
							let arr1 = arr[1].slice(0,2) 
							this.freightForm.collectPayment = arr[0]+'.'+arr1
							this.freightForm.receiptPayment = (this.info.shippingPrice * this.freightForm.goodsLoad - this.freightForm.collectPayment).toFixed(2)
							 // this.freightForm.collectPayment = val.toFixed(2)
						})
					}
					this.freightForm.receiptPayment = (this.info.shippingPrice * this.freightForm.goodsLoad - this.freightForm.collectPayment).toFixed(2)
					if(this.freightForm.receiptPayment == 0){
						this.freightForm.receiptPayment = ""
					}
				}else{
					
					this.reset = false
					this.$nextTick(() => {
					   this.freightForm.collectPayment =(this.info.shippingPrice * this.freightForm.goodsLoad).toFixed(2)
					   this.freightForm.receiptPayment = 0
					 })
					 this.reset = true
				}
			},
			searchCar(){
				this.getCar({plateNum: this.carInput})
			},
			searchDriver(){
				this.getDriver({driverKey: this.driverInput})
			},
			formatter(type, value) {
				if (type === 'year') {
					return `${value}年`
				}
				if (type === 'month') {
					return `${value}月`
				}
				if (type === 'day') {
					return `${value}日`
				}
				return value
			},
			//切换tab
			tabClick(e) {
				if(e == 0 && this.noSeled1){
					return false
				}else if(e == 1 && this.noSeled0){
					return false
				}else{
					this.freightForm= {
						starDate:'请选择 >',
						endDate: '请选择 >',
						freightValue: 1,
						remark:'',
					}
					this.freightVal = '请选择 >'
					this.tabIndex = e
				}
			},
			getInfo(option){
				wayBillStowageInfo(option).then(res => {
					if(res.code == 0){
						this.info = res.data
						this.waybillMode = res.data.waybillMode
					}else{
					   uni.$u.toast(res.msg);
				  }
				})
			},
			 changeHandler(e) {
			       
			},
			changeHand(){
				this.dispatchShow = true
			},
			groupChange1(n) {
			  this.waybillModesel = n 
			},
			radioChange1(value,i) {
				this.radiolist1.forEach((item,index) => {
					if(i == index){
						item.disabled = true
					}else{
						item.disabled = false
					}
				})
				this.waybillMode = i+1
			},
			//获取司机列表
			getDriver(data){
				let a  = {
					etpId: this.etpId,
					queryType: "1",
					projectId: Cache.get('itemId'),
					...data
				}
				querySelectorDriver(a).then(res => {
					if(res.code == 0){
						this.driverData = res.data
						this.loadingDriver = false
					}else{
					   uni.$u.toast(res.msg);
				  }
				})
			},
			dispatchClose(){
				this.dispatchShow = false
			},
			//获取车辆
			getCar(data){
				let a ={
					etpId: this.etpId,
					"queryType":"1",
					...data
				}
				querySelectorVehicle(a).then(res => {
					if(res.code == 0){
						this.carData = res.data
					}else{
						   uni.$u.toast(res.msg);
					  }
				})
			},
			//选择开始时间
			selDate1(e) {
				this.showStarDate = false
				this.freightForm.starDate =  this.changeTimeFormat(e.value,1)
				this.minDate1 = e.value
			},
			//选择结束时间
			selDate2(e){
				this.showEndDate = false
				this.freightForm.endDate = this.changeTimeFormat(e.value,1)
				
			},
				// 回调参数为包含columnIndex、value、values
			selDate(e) {
				this.showDate = false
				this.date = this.changeTimeFormat(e.value)
			},
			//弹出司机选择
			 openDriver() {
				
				this.driverShow = true
			  },
			  //选择车辆
			  selDriver(item){
				  this.driver = item
				  this.driverShow = false
				   this.showCar = false
			  },
			  selCar(item){
				  this.carInfo = item
				  this.driverShow = false
				   this.showCar = false
			  },
			  //弹出车辆选择
			  openCar(){
				  this.showCar = true
				  this.getCar()
			  },
			  close() {
				// this.driverShow = false
				this.driverShow = false
			  },
			  back(){
				  // uni.navigateTo({
				  // 	url: '/pages/waybill/waybill?id=' + this.wayBillId 
				  // });
				  uni.redirectTo({
				  		url: '/pages/waybill/waybill?id=' + this.wayBillId
				  });
				  // uni.navigateBack()
			  },
			  selStowageStatu(){
			    
				this.waybillModesel = this.waybillMode
				 this.dispatchShow = false
				 this.waybillName = this.waybillModesel == 1?'指派模式': this.waybillModesel == 2?'抢单模式':'货源广场'
			  },
			  save(){
				  this.waybillMode = this.waybillModesel
				  if(this.waybillMode == 1){
					  this.addForm.waybillId= this.wayBillId,
					  this.addForm.vehicleNo=this.carInfo.plateNum
					  this.addForm.vehicleId=this.carInfo.vehicleInfoId
					  this.addForm.driverId=this.driver.driverId
					  this.addForm.driverName= this.driver.driverName
					  this.addForm.driverTel=this.driver.mobile
					  
					 if(!this.addForm.driverName){
						uni.$u.toast('请选择司机');
						return false
					 }if(!this.addForm.vehicleNo){
						  	uni.$u.toast('请选择车辆');
							return false
					  }
					  if(!this.addForm.planShippingNum){
						uni.$u.toast('计划运输数量不能为空');
						return false
					  }
					 //  if(!this.addForm.prepayTotal){
						// uni.$u.toast('到付金额不能为空');
						// return false
					 //  }
					console.log(this.addForm.receiptTotal<= 0,'----',this.addForm.receiptTotal)
					if(this.addForm.receiptTotal<= 0){
						uni.$u.toast('回单付金额不能为空');
						return false
					  }	
					if(this.addForm.receiptTotal == 0){
						uni.$u.toast('回单付金额不能为0');
						return false
					  }	
					  if (this.info.unitName === '立方' || this.info.unitName === '纸箱') {
					  	let reg = /^\d+(\.\d{1,4})?$/
					  	console.log()
					  	if (!reg.test(this.addForm.planShippingNum)) {
					  		uni.showToast({
					  			title: '请填写正确的运输数量',
					  			icon: 'none'
					  		})
					  		return
					  	}
					  }
						// planShippingNum--计划运输数量
					  // prepayTotal--预付
					  // receiptTotal--回单付
					  let a = {
						  loadingOrderVos: [this.addForm],
						  waybill: {
							  waybillId: this.wayBillId,
							  waybillMode : 1,
						  }
					  }
					  // return false
					  shipWaybill(a).then(res => {
						  if(res.code == 0){
							 if(res.msg == '运单配载成功'){
								  this.addSel = true
								 // this.upWayBillMold({waybillId: this.wayBillId,waybillMode:1})
								 uni.$u.toast(res.msg);
							 }else{
								 uni.$u.toast(res.msg);
							 }
							  
						  }else{
							   uni.$u.toast(res.msg);
						  }
					  })
				  }else{
						if(!this.qrCodeTime){
							uni.$u.toast('可扫次数不能为空');
							return false
							}
						if(this.date == '请选择时间'){
							uni.$u.toast('到期时间不能为空');
							return false
						  }
					  let a = {
						  waybillId: this.wayBillId,
						  qrCodeTime: this.qrCodeTime,//可扫次数
						  qrCodeEndtime: this.date,
						  waybillMode: this.waybillMode
					  }
					  configureQrCode(a).then(res => {
						  if(res.code == 0){
							  // this.upWayBillMold({waybillId: this.wayBillId,waybillMode:2})
							  uni.redirectTo({
							  	url: '/pages/waybill/QRcode?wayBillId='+ this.wayBillId
							  });
						  }else{
							   uni.$u.toast(res.msg);
						  }
					  })
				  }
					
				  
				
			  },
			  //确定配载模式
			 upWayBillMold(data){
				 updateWayBillMold(data).then(res => {
				 	if (res.code == 0) {
				 		// uni.$u.toast(res.msg);
				 	} else {
				 		this.$refs.uToast.show({
				 			message: res.message
				 		})
				 	}
				 })
			 },
			  seeStoDetail(){
				  Cache.set('selInfo',2)
				  uni.reLaunch({
				  	url: '/pages/home/home'
				  })
			  },
			  addNew(){
				  uni.navigateTo({
				  		url: '/pages/waybill/allocate?wayBillId='+ this.wayBillId + '&waybillName='+ '指派模式' + "&isChange=1"
					});
			  },
			  addDriver(){
				  uni.navigateTo({
				  	url: '/pages/driver/register'
				  });
			  },
			  addCar(){
				  uni.navigateTo({
				  	url: '/pages/vehicle/register'
				  });
			  },
			  changeTimeFormat:function(time,i) {
			  	var date = new Date(time);
			  	var month = date.getMonth() + 1 < 10 ? "0" + (date.getMonth() + 1) : date.getMonth() + 1;
			  	var currentDate = date.getDate() < 10 ? "0" + date.getDate() : date.getDate();
			  	var hh = date.getHours() < 10 ? "0" + date.getHours() : date.getHours();
			  	var mm = date.getMinutes() < 10 ? "0" + date.getMinutes() : date.getMinutes();
				var ss = date.getSeconds() < 10 ? "0" + date.getSeconds() : date.getSeconds();
				if(i == 1){
					return date.getFullYear() + "-" + month + "-" + currentDate+" "+ hh + ":" + mm;
				}
			  	return date.getFullYear() + "-" + month + "-" + currentDate+" "+ hh + ":" + mm+ ':' + ss;
			  	//返回格式：yyyy-MM-dd hh:mm
			  },
			  typeCancel() {
			  	this.showfreight = false
			  },
			freightChange(item,index){
				this.freightForm.freightValue = item.dicValue
			},
			typeConfirm(){
				let a = this.natureColumns.find(item => {
					if(this.freightForm.freightValue == item.dicValue){
						return item
					}
				})
				this.freightVal = a.dicName
				this.showfreight = false
			},
			//保存
			saveFreight(){
				// "waybillMode": 1.指派模式2.抢单模式3.货源广场
				// "goodsTimeStart": 货物有效开始时间
				// "goodsTimeEnd": 货物有效结束时间
				// "pricingMethod": 计价方式 1.单位计价 2.固定计价
				// "freightRounding": 运费取整 1.运费不取整 2.个位取整 3.十位取整 4.百位取整
				// "unitPriceDisplay": 单价显示 0.不显示 1显示
				// "goodsRemarks": 货物备注
				// "goodsState":货物上架状态 0未上架 1上架 2下架
				// "goodsLoad":每车载重
				// "collectPayment": 到付
				// "receiptPayment": 回单付
				
				let a 
				if(this.tabIndex == 0){
					
					// 手机抢单
					 a = {
						pricingMethod:1,
						waybillMode: 3,
						goodsTimeStart:this.freightForm.starDate+':00',
						goodsTimeEnd:this.freightForm.endDate+':00',
						freightRounding: this.freightForm.freightValue,
						unitPriceDisplay: this.checked?1:0,
						goodsRemarks: this.freightForm.remark,
						goodsState: 0
					}
				}else{
					 a = {
						waybillMode: 3,
						goodsTimeStart:this.freightForm.starDate+":00",
						goodsTimeEnd:this.freightForm.endDate+':00',
						pricingMethod:2,
						goodsLoad: this.freightForm.goodsLoad,
						collectPayment: this.freightForm.collectPayment,
						receiptPayment:this.freightForm.receiptPayment,
						unitPriceDisplay: this.checked?1:0,
						goodsRemarks: this.freightForm.remark,
						goodsState: 0
					}
				}
				let data= {
					  // loadingOrderVos: [a],
					  waybill: {
						  waybillId: this.wayBillId,
						  waybillMode : 3,
						  ...a
					  }
				}
				shipWaybill(data).then(res => {
					if(res.code == 0){
						this.trueChange()
						// this.upWayBillMold({waybillId: this.wayBillId,waybillMode:3})
						uni.$u.toast('保存成功');
					}else{
						uni.$u.toast(res.msg);
					}
				})
				
			},
			upFreight(){
				let a
				if(this.freightForm.starDate == '请选择 >'){
					return uni.$u.toast('请选择开始时间');
				}
				if(this.freightForm.endDate == '请选择 >'){
					return uni.$u.toast('请选择结束时间');
				}
				if(this.tabIndex == 0){
					if(this.freightVal == '请选择 >'){
						return uni.$u.toast('请选择运费取证方式');
					}
					
					// 手机抢单
					 a = {
						pricingMethod:1,
						waybillMode: 3,
						goodsTimeStart:this.freightForm.starDate+':00',
						goodsTimeEnd:this.freightForm.endDate+':00',
						freightRounding: this.freightForm.freightValue,
						unitPriceDisplay: this.checked?1:0,
						goodsRemarks: this.freightForm.remark,
						goodsState: 1
					}
				}else{
					// if(!this.freightForm.collectPayment ){
					// 	return uni.$u.toast('请选择到付金额');
					// }
					if(this.freightForm.receiptPayment == 0){
						return uni.$u.toast('回单付金额不能为0');
					}
					if(!this.freightForm.receiptPayment){
						return uni.$u.toast('请填写回单付金额');
					}
					
					if(!this.freightForm.goodsLoad){
						return uni.$u.toast('未填写运输数量');
					}
					if (this.info.unitName === '立方' || this.info.unitName === '纸箱') {
						let reg = /^\d+(\.\d{1,4})?$/
						console.log()
						if (!reg.test(this.freightForm.goodsLoad)) {
							uni.showToast({
								title: '请填写正确的运输数量',
								icon: 'none'
							})
							return
						}
					}
					if (this.info.unitName === '件') {
						let reg = /^\d+(?:\d{0,0})?/
						if (!reg.test(this.freightForm.goodsLoad)) {
							uni.showToast({
								title: '请填写正确的运输数量',
								icon: 'none'
							})
							return
						}
					}
					if (this.info.unitName === '吨') {
						let reg = /^\d+(\.\d{1,4})?$/
						if (!reg.test(this.freightForm.goodsLoad)) {
							uni.showToast({
								title: '运输数量小数点后最多4位',
								icon: 'none'
							})
							return
						}
					}
					 a = {
						waybillMode: 3,
						goodsTimeStart:this.freightForm.starDate+':00',
						goodsTimeEnd:this.freightForm.endDate+':00',
						pricingMethod:2,
						goodsLoad: this.freightForm.goodsLoad,
						collectPayment: this.freightForm.collectPayment,
						receiptPayment:this.freightForm.receiptPayment,
						unitPriceDisplay: this.checked?1:0,
						goodsRemarks: this.freightForm.remark,
						goodsState: 1
					}
				}
				
				let data= {
					waybill: {
						  waybillId: this.wayBillId,
						  waybillMode : 3,
						  ...a
					}
				}
				console.log(data,111111111111111111111)
				shipWaybill(data).then(res => {
					if(res.code == 0){
						this.trueChange()
						// this.upWayBillMold({waybillId: this.wayBillId,waybillMode:3})
						uni.$u.toast(res.msg);
						if(this.tabIndex == 0){
							this.noSeled0 = true
							this.noClick1 = true
							this.getGoodsSquareInfo({Waybill :this.wayBillId})
						}else{
							this.noSeled1 = true
							this.noClick0 = true
							this.getGoodsSquareInfo({Waybill :this.wayBillId})
						}
					}else{
						uni.$u.toast(res.msg);
					}
				})
			},
			down(value){
				let a
				if(this.tabIndex == 0){
					// 手机抢单
					 a = {
						pricingMethod:1,
						waybillMode: 3,
						goodsTimeStart:this.freightForm.starDate+':00',
						goodsTimeEnd:this.freightForm.endDate+':00',
						freightRounding: this.freightForm.freightValue,
						unitPriceDisplay: this.checked?1:0,
						goodsRemarks: this.freightForm.remark,
						goodsState: 2
					}
				}else{
					 a = {
						waybillMode: 3,
						goodsTimeStart:this.freightForm.starDate+':00',
						goodsTimeEnd:this.freightForm.endDate+':00',
						pricingMethod:2,
						goodsLoad: this.freightForm.goodsLoad,
						collectPayment: this.freightForm.collectPayment,
						receiptPayment:this.freightForm.receiptPayment,
						unitPriceDisplay: this.checked?1:0,
						goodsRemarks: this.freightForm.remark,
						goodsState: 2, //0未上架 1上架 2下架
					}
				}
				let data= {
					  waybill: {
						  waybillId: this.wayBillId,
						  waybillMode : 3,
						  ...a
					  }
				}
				shipWaybill(data).then(res => {
					if(res.code == 0){
						uni.$u.toast('下架成功');
						if(this.tabIndex == 0){
							this.noSeled0 = false
							this.getGoodsSquareInfo({Waybill :this.wayBillId})
						}else{
							this.noSeled1 = false
							this.getGoodsSquareInfo({Waybill :this.wayBillId})
						}
					}else{
						uni.$u.toast(res.msg);
					}
				})
			}
			
		}
	}
</script>

<style lang="less">
	*{
		padding: 0;
		margin: 0;
		box-sizing: border-box;
	}
	.content{
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		background: #FFFFFF;
		padding-bottom: 200rpx;
		padding-top: 168rpx;
		.tabBox1 {
			text-align: center;
			padding: 0 24rpx 0 32rpx;
			background-color: #FFFFFF;
			
			.tabLeft {
				display: flex;
				.tabLi {
					width: 50%;
					color: #999;
					font-size: 28rpx;
					line-height: 60rpx;
				}
		
				.tab_select {
					font-size: 28rpx;
					font-family: PingFangSC-Semibold, PingFang SC;
					font-weight: 600;
					color: #02478D;
					line-height: 60rpx;
					border-bottom: 4rpx solid #02478D;;
				}
		
			}
		
			.tabRight {
				float: right;
				display: flex;
				font-size: 28rpx;
				font-family: PingFangSC-Medium, PingFang SC;
				background: url('@/static/waybIll/screen.png') no-repeat;
				padding-right: 20px;
				background-position: right;
				font-weight: 600;
				color: #333333;
				line-height: 80rpx;
				.icon {
					margin-left: 13rpx
				}
			}
		}
		.head{
			height: 168rpx;
			display: flex;
			background: #FFFFFF;
			padding-top: 30rpx;
			margin-bottom: 14rpx;
			.headCon{
				height: 90rpx;
				width: 33%;
				border-right: 2rpx solid #F5F7FB;
				text-align: center;
				.headConTop{
					display: flex;
					font-size: 20rpx;
					font-family: PingFangSC-Regular, PingFang SC;
					font-weight: 400;
					color: #333333;
					margin-bottom: 20rpx;
					padding-left: 52rpx;
					align-items:center;
				}
				.num{
					font-size: 44rpx;
					font-family: DINPro-Bold, DINPro;
					font-weight: bold;
					color: #333333;
				}
			}
		}
		.selList{
			width: 100%;
			background: #FFFFFF;
			padding: 0 48rpx 0 48rpx;
			border-bottom: 14rpx solid #FAFAFA;;
			.selLi{
				font-size: 28rpx;
				font-family: PingFangSC-Medium, PingFang SC;
				font-weight: 500;
				color: #333333;
				height: 96rpx;
				line-height: 96rpx;
				border-bottom:2rpx solid #FAFAFA;;
				.fr{
					float: right;
					display: flex;
					font-size: 28rpx;
					font-family: PingFangSC-Regular, PingFang SC;
					font-weight: 400;
					color: #9E9E9E;
					height: 96rpx;
					.icon{
						margin-top: 36rpx;
						margin-left: 8rpx;
					}
				}
				.uni-input-placeholder{
					float: right;
					font-size: 28rpx;
					font-family: PingFangSC-Regular, PingFang SC;
					font-weight: 400;
					color: #9E9E9E!important;
					text-align: right;
				}
			}
			.driverPopup {
				padding: 0 28rpx;
				height: 750rpx;
				.head{
					height: 84rpx;
					font-size: 30rpx;
					font-family: PingFangSC-Medium, PingFang SC;
					font-weight: 500;
					color: #333333;
					display: block;
					text-align: center;
					text{
						font-weight: 400;
						color: #333333;
						float: left;
					}
					.addDriver{
						color: #00468C;
						float: right;
					}
				}
				.driverCont{
					padding-top: 16rpx;
					margin-bottom: 20rpx;
					.notext{
						font-size: 28rpx;
						font-family: PingFangSC-Regular, PingFang SC;
						font-weight: 400;
						color: #A1A1A1;
						margin: 144rpx auto 230rpx;
						text-align: center;
					}
					.driverList{
						padding-bottom: 36rpx;
						
						height: 600rpx;
						overflow-y: auto;
						.driverLi{
							border-bottom: 2rpx solid #F5F7FB;
							padding-top: 8rpx;
							height: 120rpx;
							text-align: left;
							font-size: 32rpx;
							font-family: PingFangSC-Semibold, PingFang SC;
							font-weight: 600;
							color: #333333;
							.driverPhone{
								font-size: 28rpx;
								font-family: PingFangSC-Medium, PingFang SC;
								font-weight: 500;
								color: #333333;
								padding-top: 14rpx;
							}
						}
						.driverLi:last-child{
							border: none;
						}
					}
					.carList{
						font-size: 30rpx;
						height: 500rpx;
						overflow-y: auto;
						margin-bottom: 30rpx;
						.carLi{
							height: 60rpx;
							line-height: 60rpx;
							border-bottom: 2rpx solid #FAFAFA;
						}
					}
				}
			}
		}
		.remarks{
			width: 100%;
			background: #FFFFFF;
			padding: 28rpx 44rpx;
			.textBox{
				height: 300rpx;
				border-radius: 8rpx;
				border: 2rpx solid #9E9E9E;
			}
			h5{
				
				font-size: 28rpx;
				font-family: PingFangSC-Medium, PingFang SC;
				font-weight: 500;
				color: #333333;
				line-height: 40rpx;
				margin-bottom: 14rpx;
			}
		}
		.btnBox {
			width: 100%;
			// height: 128rpx;
			background: #FFFFFF;
			position: fixed;
			padding: 14rpx 32rpx 24rpx;
			bottom: 0;
			left: 0;
		
			
		
			.btn {
				color: #FFFFFF;
				border-radius: 6px;
				height: 80rpx;
				background: linear-gradient(to right, #4d83b9, #003E81);
				text-align: center;
				font-size: 30rpx;
				font-family: PingFangSC-Medium, PingFang SC;
				font-weight: 500;
				color: #FFFFFF;
				line-height: 80rpx;
			}
			.save{
				float: left;
				width: 30%;
				background: #FAFAFA;
				color: #003E81;
			}
			.up{
				float: right;
				width: 65%;
			}
			
		}
		.dispatchBox{
			width: 664rpx;
			background: #FFFFFF;
			border-radius: 8rpx;
			position: relative;
			.close{
				width: 28rpx;
				height: 28rpx;
				position: absolute;
				top: 28rpx;
				right: 28rpx;
			}
			.tabUl{
				padding: 0 44rpx 54rpx 44rpx;
				.tabLi{
					height: 154rpx;
					line-height: 154rpx;
					font-size: 44rpx;
					font-family: PingFangSC-Medium, PingFang SC;
					font-weight: 500;
					color: #333333;
					width: 576rpx;
					border-bottom: 2rpx solid #F5F7FB;
					background: url('@/static/waybIll/qiangd.png') no-repeat;
					background-size: 60rpx 58rpx;
					background-position: 0 center;
					padding-left: 76rpx;
					.u-checkbox-group--row{
						width: 44rpx;
						height: 44rpx;
						margin-top: 98rpx;
						float: right;
						margin-top: 52rpx;					
					}
				}
				.tabLi:nth-child(2){
					background: url('@/static/waybIll/zhipai.png') no-repeat;
					background-size: 60rpx 58rpx;
					background-position: 0 center;
				}
				.selBox{
					width: 44rpx;
					height: 44rpx;
					background: #EBEBEB;
					border-radius: 50%;
					float: right;
					margin-top: 50rpx;
				}
				.seled{
					background: #00468C;
					text-align: center;
					line-height: 44rpx;
					padding: 4rpx 0 0 4rpx;
				}
				
			}
			.selDispatch{
				padding: 0 32rpx;
				box-sizing: border-box;
				margin: 0 auto 44rpx;
				view{
					color: #FFFFFF;
					font-size: 30rpx;
					font-weight: 500;
					line-height: 80rpx;
					border-radius: 12rpx;
					text-align: center;
					box-shadow: 0 0 20rpx 12rpx rgba(0, 62, 129, 0.04);
					background: linear-gradient(to right, #4d83b9, #003E81);
				}
			}
			.dispatchHead{
				font-size: 32rpx;
				text-align: center;
				font-family: PingFangSC-Semibold, PingFang SC;
				font-weight: 600;
				margin: 44rpx 0 36rpx;
				color: #333333;
			}
		}
		.header-wrap {
			position: absolute;
			z-index: 10076;
			top: 0;
			left: 0;
			width: 100vw;
			box-sizing: border-box;
			padding: 100rpx 24rpx 16rpx;
			background: #fff;
			.nav-wrap{
				display: flex;
				align-items: center;
				justify-content: space-between;
				.left{
					image{
						width: 100%;
						height: 100%;
					}
				}
				text {
					min-width: 30rpx;
					font-size: 28rpx;
					font-family: PingFangSC-Medium, PingFang SC;
					font-weight: 500;
					color: #333333;
				}
			}
		}
		.addDiv{
			width: 600rpx;
			padding-top: 40rpx;
			border-radius: 5rpx;
			.words{
				text-align: center;
				height: 150rpx;
				line-height: 150rpx;
			}
			.selbtn{
				width: 100%;
				color: #333333;
				border-top: 2rpx solid #333333;
				font-size: 28rpx;
				display: flex;
				view{
					width: 50%;
					height: 100rpx;
					line-height: 100rpx;
					text-align: center;
				}
			}
		}
		.modeThree{
			
			.mode3Li{
				padding: 0 32rpx;
				font-size: 28rpx;
				font-family: PingFangSC-Medium, PingFang SC;
				font-weight: 500;
				color: #333333;
				height: 96rpx;
				line-height: 96rpx;
				border-bottom:2rpx solid #FAFAFA;;
				.fr{
					float: right;
					display: flex;
					font-size: 28rpx;
					font-family: PingFangSC-Regular, PingFang SC;
					font-weight: 400;
					color: #9E9E9E;
					height: 96rpx;
					.icon{
						margin-top: 36rpx;
						margin-left: 8rpx;
					}
				}
			}
		}
		.popup-wrap {
			padding: 0 32rpx 32rpx;
			border-top: 1rpx solid #FAFAFA;
			position: relative;
			z-index: 10080;
			.head{
				height: 84rpx;
				font-size: 34rpx;
				font-family: PingFangSC-Medium, PingFang SC;
				font-weight: 700;
				color: #333333;
				display: block;
				margin-bottom: 50rpx;
				text-align: center;
			}
			.popup-btn {
				display: flex;
				align-items: center;
				justify-content: space-between;
		
				.btn {
					font-size: 30rpx;
					font-weight: 500;
					line-height: 80rpx;
					border-radius: 12rpx;
					text-align: center;
					box-shadow: 0 0 20rpx 12rpx rgba(0, 62, 129, 0.04);
					box-sizing: border-box;
				}
		
				.cancel {
					color: #333333;
					width: 40%;
					background: #fff;
					border: 1rpx solid #e9e9e9;
				}
		
				.confirm {
					width: 55%;
					color: #FFFFFF;
					background: linear-gradient(to right, #4d83b9, #003E81);
				}
			}
		}
		.popup-list {
			box-sizing: border-box;
			font-size: 30rpx;
			font-weight: 500;
			color: #333333;
		
			.box {
				display: flex;
				align-items: center;
				justify-content: center;
				background: #fff;
				padding: 12rpx 0 40rpx 0;
		
				.type-item {
					width: 30%;
					display: flex;
					flex-direction: column;
					align-items: center;
					box-sizing: border-box;
					text-align: center;
					font-size: 26rpx;
					font-weight: 400;
					color: #666;
					line-height: 64rpx;
					overflow: auto;
					background: #FAFAFA;
					margin-right: 3.33%;
					border-radius: 6rpx;
		
					&:nth-child(2) {
						border-left: 1rpx solid #FAFAFA;
						border-right: 1rpx solid #FAFAFA;
					}
				}
				.active {
					background: #034082;
					color: #FAFAFA;
					font-weight: 500;
				}
			}
		}
		.u-input{
			background: #FFFFFF!important;
		}
		
		.popup-wrap {
			padding: 32rpx;
		
			.popup-empty {
				text-align: center;
				color: #c0c4cc;
				font-size: 30rpx;
				padding: 32rpx 0;
			}
		
			.title {
				text-align: center;
				font-size: 32rpx;
				font-weight: 500;
				color: #333333;
				margin-bottom: 24rpx;
			}
		
			.popup-btn {
				display: flex;
				align-items: center;
				justify-content: space-between;
				padding: 12rpx 0 calc(12rpx + env(safe-area-inset-bottom));
		
				.btn {
					font-size: 30rpx;
					font-weight: 500;
					line-height: 80rpx;
					border-radius: 12rpx;
					text-align: center;
					box-shadow: 0 0 20rpx 12rpx rgba(0, 62, 129, 0.04);
					box-sizing: border-box;
				}
		
				.cancel {
					color: #333333;
					width: 40%;
					background: #fff;
					border: 1rpx solid #e9e9e9;
				}
		
				.confirm {
					width: 55%;
					color: #FFFFFF;
					background: linear-gradient(to right, #4d83b9, #003E81);
				}
			}
		
			.popup-list {
				max-height: 460rpx;
				box-sizing: border-box;
				overflow: auto;
				margin: 12rpx 0;
		
				.item {
					border-bottom: 1rpx solid #F5F7FB;
		
					.u-radio {
						padding: 24rpx 0;
					}
		
					&:last-child {
						border-bottom: none;
					}
				}
			}
		}
		
	}
</style>